@extends('layouts.app')

@section('content')
    <div class="container">
        <div class="container-fluid">
    @include('layouts._success')
            <!-- start page title -->
            <div class="row">
                <div class="col-12">
                    <div class="page-title-box">
                        <div class="page-title-right">
                            <ol class="breadcrumb m-0">
                                <li class="breadcrumb-item"><a href="">其他</a></li>
                                <li class="breadcrumb-item"><a href="{{ route('bugs.index') }}">bug时间线</a></li>
                            </ol>
                        </div>
                        <h4 class="page-title">反馈BUG</h4>
                    </div>
                </div>
            </div>
            <!-- end page title -->

            <div class="row">
                <div class="col-12">
                    <div class="card-box">
                        <form id="demo-form" data-parsley-validate="" action="{{route('bugs.store')}}" method="POST">
                            <div class="form-group">
                                <label for="writer">一句话简单描述bug * :</label>
                                <input type="text" id="writer" class="form-control" name="title"
                                       data-parsley-trigger="change" required="" value="{{ old('title') }}" style="border-radius: 4%;width: 40%;">
                            </div>
                            <div class="form-group">
                                <label for="writer">影响系数 * :</label>
                                <input type="text" id="writer" class="form-control" name="modulus"
                                       data-parsley-trigger="change" value="{{ old('modulus') }}" required="" style="border-radius: 4%;width:8%;">
                            </div>
                            <input type="hidden" name="author" value="{{ Auth::user()->name }}">
                            {{ csrf_field() }}
                            @if (Session::has('name'))
                                <input type="hidden" value="{{ Session::get('name') }}" name="other">
                            @endif
                            <div class="form-group">
                                <label for="message">bug详情 (最少40字 :</label>
                                <textarea id="message" class="form-control" name="content"
                                          data-parsley-trigger="keyup" data-parsley-minlength="20"
                                          data-parsley-maxlength="100"
                                          data-parsley-validation-threshold="10">
                                    {{ old('content') }}
                                            </textarea>
                            </div>
                            <div class="form-group">
                                <label for="message">附件 (可上传文件，图片 :</label>
                                <button type="button" class="btn btn-secondary waves-effect" data-toggle="modal" data-target="#modal-file-upload">
                                    <i class="fa fa-upload"></i> 上传
                                </button>
                                @if (Session::has('name'))
                                    <a href="javascript:void(0);" onclick="preview_image('/storage/{{ Session::get('name') }}')">{{ Session::get('name') }}</a>
                                @endif
                            </div>
                            <div style="color: #313b48;font-size: 8px;">注意：如果有附件请先上传附件，否则将会有清空填写数据的bug</div>
                            <div class="form-group mb-0">
                                <input type="submit" value="添加信息" class="btn btn-success">
                            </div>
                        </form>

                        {{-- 上传文件 --}}
                        <div class="modal fade" id="modal-file-upload">
                            <div class="modal-dialog">
                                <div class="modal-content">
                                    <form method="POST" action="{{ route('bugs/upload') }}" enctype="multipart/form-data">
                                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                                        <div class="modal-header">
                                            <h4 class="modal-title">上传新文件</h4>
                                            <button type="button" class="close" data-dismiss="modal">
                                                ×
                                            </button>
                                        </div>
                                        <div class="modal-body">
                                            <div class="form-group row">
                                                <label for="file" class="col-sm-3 col-form-label">
                                                    文件
                                                </label>
                                                <div class="col-sm-8">
                                                    <input type="file" id="file" name="file">
                                                </div>
                                            </div>
                                            <div class="form-group row">
                                                <label for="file_name" class="col-sm-3 col-form-label">
                                                    文件名（可选）
                                                </label>
                                                <div class="col-sm-8">
                                                    <input type="text" id="file_name" name="file_name" class="form-control">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="modal-footer">
                                            <button type="button" class="btn btn-secondary" data-dismiss="modal">
                                                取消
                                            </button>
                                            <button type="submit" class="btn btn-primary">
                                                上传文件
                                            </button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>

                        {{-- 浏览图片 --}}
                        <div class="modal fade" id="modal-image-view">
                            <div class="modal-dialog">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h4 class="modal-title">图片预览</h4>
                                        <button type="button" class="close" data-dismiss="modal">
                                            ×
                                        </button>
                                    </div>
                                    <div class="modal-body">
                                        <img id="preview-image" src="x" class="img-responsive">
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" data-dismiss="modal">
                                            取消
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div> <!-- end card-box-->
                </div> <!-- end col-->
            </div>
            <!-- end row -->

        </div>
    </div>
    <script>
        // 预览图片
        function preview_image(path) {
            $("#preview-image").attr("src", path);
            $("#modal-image-view").modal("show");
        }
    </script>
@endsection
